<template>
	<view>
		<view :class="getClass">
			<!-- 状态栏 -->
			<view :style="'height:' + statusBarHeight + 'px'"></view>
			<!-- 导航栏 -->
			<view class="w-100 flex align-center justify-between" style="height: 90rpx;">
				<!-- 左 -->
				<view class="flex align-center">
	
					<view v-if="title" class="font-md ml-3 text-828CA6">
						<!-- <slot name="title"></slot> -->
						{{getTitle}}
					</view>
					</slot>
					<!-- 标题 -->
					<!-- <slot>
						<text v-if="title" class="font-md ml-3">{{getTitle}}</text>
					</slot> -->
				</view>
			</view>
		</view>
	
		

	</view>
</template>

<script>
	export default {
		props: {
			title: {
				type: [String,Boolean],
				default: false
			},
			fixed:{
				type:Boolean,
				default: true
			},
			noreadnum:{
				type:Number,
				default: 0
			},
			bgColor:{
				type:String,
				default:"bg-F8F9FA"
			},
			
		},
		data() {
			return {
				statusBarHeight: 0,
				navBarHeight:0,
			}
		},
		mounted() {
			// #ifdef APP-PLUS-NVUE
			this.statusBarHeight = plus.navigator.getStatusbarHeight()
			// #endif
			this.navBarHeight = this.statusBarHeight + uni.upx2px(90)
		},
		computed: {
			fixedStyle() {
				return `height:${this.navBarHeight}px`
			},
			getTitle(){
				let noreadnum = this.noreadnum > 0 ? '('+this.noreadnum+')' : ''
				return this.title + noreadnum
			},
			
			// 动态获取菜单高度
			getMenusHeight(){
			   let H = 38
			   return this.menus.length * H
			},
			getMenusStyle(){
			   return `height: ${this.getMenusHeight}`
			},
			getClass(){
				let fixed = this.fixed ? '' : ''
				return `${fixed} ${this.bgColor}`
			}
		},
		methods:{
			search(){
				uni.navigateTo({
					url:"/pages/common/search/search"
				})
			},
		}
	}
</script>

<style>
</style>
